.side-fixed{display:block;position:fixed;top:35%;right:0;cursor:pointer;width:65px;background:#fff;box-shadow: 0 0 10px 0 rgba(0,0,0,0.15);}
.side-fixed a{display:block;width:65px;height:80px;font-size:14px;color:#505f72;padding-top:50px;text-align:center;position:relative;}
.side-fixed a:after{content:'';width:61px;height:1px;background:#e7e7e8;position:absolute;left:2px;bottom:0;}
.side-fixed a.wx{background: url(wx1.png) center 10px no-repeat;}
.side-fixed a.wb{background: url(wb1.png) center 10px no-repeat;}
.side-fixed a.dy{background: url(dy1.png) center 10px no-repeat;}
.side-fixed a.ks{background: url(ks1.png) center 10px no-repeat;}
.side-fixed a.vd{background: url(vd1.png) center 10px no-repeat;}
.side-fixed a .code{position:absolute;top:0;left:-150px;margin-bottom:10px;padding:15px;width:140px;height:140px;background:#fff;box-shadow:0 0 10px rgba(0,0,0,0.15);border-radius:5px;box-sizing: border-box;visibility:hidden;opacity:0;transform: translateY(-10px);transition: all 0.2s ease-out 0s;}
.side-fixed a .code:after{content:'';position:absolute;right:0;top:35%;margin-right:-20px;width:0;height:0;border:10px solid transparent;font-size:0;border-left-color:#fff;}
.side-fixed a .code>img {display: block;width:100%;height:auto;}
.side-fixed a:hover{color:#fff;}
.side-fixed a:hover .code{visibility:visible;opacity:1;transform:none;}
.side-fixed .wx:hover{background: #00479d url(wx.png) center 20px no-repeat;}
.side-fixed .wb:hover{background: #00479d url(wb.png) center 20px no-repeat;}
.side-fixed .dy:hover{background: #00479d url(dy.png) center 20px no-repeat;}
.side-fixed .ks:hover{background: #00479d url(ks.png) center 20px no-repeat;}
.side-fixed .vd:hover{background: #00479d url(vd.png) center 20px no-repeat;}
.side-fixed .close{display:block;width:16px;height:16px;background: url(close.png) no-repeat;position:absolute;top:-22px;right:5px;}